<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title></title>

		<!-- <base href="http://news.baidu.com/" target="_blank"> -->
		<style>
			body{
				height: 4000px;
			}
			ul,ol{
				list-style: none;
			}
		</style>
	</head>
	<body>
		<!-- 单标签不需要去嵌套别的标签 -->
		<img src="" alt="">
		<!-- 元素的属性不分顺序 -->
		<img width="100" src="" alt="">
		<!-- 数字、true,false,可以不写引号 -->
		<img width=100 src="" alt="">
		<img src="" alt="" width="100">
		<img class="" id="" src="" alt="">
		<!-- 有些属性可以只写属性名 -->
		<!-- novalidate关闭表单验证 -->
		<form action="" novalidate>

			<input type="text" required>
			<button>提交</button>
		</form>
		<div>
			<div>
				<h1></h1>
			</div>
		</div>
		<!-- 不要使用这种嵌套方式，使用这种进行嵌套 “块级标签>行内块标签>行内标签”。 -->
		<span>
			<div></div>
		</span>
		<a href="">
			<div></div>
		</a>
		<span>测试文字</span>
		<a href="/guoji">国际</a>
		<a href="http://news.baidu.com/guoji">国际</a>
		<!-- a标签的跳转路径，默认是base里面href的值再加上a标签的href的值 -->
		<!-- a标签的跳转方式默认值base里面target的跳转方式 -->
		<!-- 也可以给a标签再指定target,那么a标签将会以自己的target方式进行跳转 -->
		<a href="/mil">军事</a>
		<a href="/mil" target="_self">军事 本页面</a>
		<!-- 块级元素，独占一行 -->
		<p>p标签</p>
		<p>p标签</p>

		<span class="text">文字</span>
		<p style="white-space: pre-wrap;">
			君不见黄河之水天上来
			奔流到海不复回
		</p>
		<div>
			用户名：<input type="text">
		</div>
		<div>
			密码：<input type="password">
		</div>
		<figure>
			<img wi src="https://interactive-examples.mdn.mozilla.net/media/examples/elephant-660-480.jpg" alt="Elephant at sunset">
			<figcaption>An elephant at sunset</figcaption>
		</figure>
		<div>
			<img wi src="https://interactive-examples.mdn.mozilla.net/media/examples/elephant-660-480.jpg" alt="Elephant at sunset">
			<p>An elephant at sunset</p>
		</div>
		<a href="http://so.com" target="sub">so</a>
		<br>
		<iframe name="sub" frameborder="1" src="https://baidu.com" width="600" height="800"></iframe>
		<iframe scrolling="no" src="https://163.com" width="600" height=""></iframe>
		<br>
		<a href="#">链接1</a><br>
		<a href="javascript:void(0)">链接2</a>
		<ul type="disc">
			<li>无序列表01</li>
			<li>无序列表02</li>
			<li>无序列表03</li>
		</ul>
		<main>
			<span>下载中：</span>
			<progress>
		</main>

		<main>
			<span>当前进度：</span>
			<progress value="50" max="100">
		</main>
		<div id="box"></div>
		div#box
		div.class
		有空格的用引号
		div[title=盒子 data-msg=very good]
		div[title=盒子 data-msg="very good"]
		<div class="abc"></div>
		<div class="box red"></div>
		<div  data-msg = "hello world"></div>
	</body>
</html>
